<template>
  <h1>一个人的信息</h1>
  <h1>姓名：{{ person.name }}</h1>
  <h1>年龄：{{ person.age }}</h1>
  <button @click="test">测试一下触发Demo组件的Hello事件</button>
  <br>
  <slot name="qwe"></slot><br>
  <slot name="www"></slot>
</template>

<script>
import {reactive} from "vue";

export default {
  name: "Demo",
  props: ['msg', 'school'],
  emits: ['hello'],

  setup(props, context) {

    console.log('---setup---', props, context)
    console.log('---setup---', props, context.attrs)
    console.log('---setup---', props, context.emit)
    console.log('---setup---', props, context.slots)

    let person = reactive({
      name: '张三',
      age: 18
    })

    function test() {
      context.emit('hello', 666)
    }

    return {
      person,
      test
    }
  }
}
</script>
